<?php

/*
 * activite/index.phtml
 * Page d'accueil des Codes d'activités
 */
?>
<?php

$title = "Codes d'activités";
$this->headTitle($title);
?>

<div class='content-head'>
    <h3>
	<?php echo $title; ?>
	<img src='<?php echo $this->basePath() . '/img/rhx/refresh-16x16.png' ?>' title="Actualiser la liste" class='rhx-refresh'>
    </h3>
    <div class='toolbar'>
        <div class="toggle add" title="Ajouter">
            <a href="#" style="display: block; width: 100%; height: 100%;" onclick="$('.add-toggle').toggle('slow');
		    return false;"></a>
        </div>
    </div>
</div>

<div class='content-body'>
    <div class='add-toggle'>
	<div class='list-container' id="newCodeForm">
	    <table class='table table-striped list-table'>
		<thead>
		    <tr>
			<td width="10%">Code</td>
			<td width="25%">Libellé</td>
			<td width="20%">Couleur</td>
			<td width="35%">Description</td>
			<td width="10%">&nbsp;</td>
		    </tr>
		</thead>
		<tbody>
		    <tr>
			<td style='text-align: center'>
			    <a href='#' id='code' data-type='text'></a>
			</td>
			<td style='text-align: center'>
			    <a href='#' id='libelle' data-type='text'></a>
			</td>
			<td style='text-align: center'>
			    <input type='text' id='couleur' value=''>
			</td>
			<td style='text-align: center'>
			    <a href='#' id='description' data-type='textarea'></a>
			</td>
			<td style='text-align: center'>
			    <button class='btn btn-success' id="ajouter" onclick='return addNew();' style="display: none;">Ajouter</button>
			</td>
		    </tr>
		</tbody>
	    </table>
	</div>
	<form id='newCode' action='#' method='post'>
	    <input type='hidden' id='new-id' name='id' value='0'>
	    <input type='hidden' id='new-code' name='code' value=''>
	    <input type='hidden' id='new-libelle' name='libelle' value=''>
	    <input type='hidden' id='new-couleur' name='couleur' value='#ffffff'>
	    <input type='hidden' id='new-description' name='description' value=''>
	</form>
	<form id='editCode' action='#' method='post'>
	    <input type='hidden' id='edit-id' name='id' value='0'>
	    <input type='hidden' id='edit-code' name='code' value=''>
	    <input type='hidden' id='edit-libelle' name='libelle' value=''>
	    <input type='hidden' id='edit-couleur' name='couleur' value=''>
	    <input type='hidden' id='edit-description' name='description' value=''>
	</form>
    </div>

    <!-- CONTENU AJAX -->
    <div id='content-data'>
	<!-- AJAX LOADING -->
    </div>
</div>

<!-- Script -->
<script type='text/javascript'>
    // Variables
    var openEdit = false;

    // Chargement
    $(function(){
	// Utilisation du SpectrumColorPicker
	$('#couleur').spectrum({
	    color: '#fff',
	    flat: false,
	    showInput : true,
	    showInitial: true,
	    chooseText: "Sélectionner",
	    cancelText: "Annuler",
	    preferredFormat: "hex6",
	    showSelectionPalette: true,
	    localStorageKey: "spectrum.homepage",
	    clickoutFiresChange: true,
	    move: function(color) {
		$('#new-couleur').val(color.toHexString());
	    }
	});

	// Actualisation
	$('.rhx-refresh').click(function(){
	    refresh();
	});

	// Chargement de la liste page 1
	refresh();

	// Editable
	$('#code').editable({
	    title : 'Edition du Code',
	    validate : function(value){
		$('#new-code').val(value);
		if($('#new-libelle').val() !== ''){
		    $('#ajouter').show();
		}else{
		    $('#ajouter').hide();
		}
	    }
	});
	$('#libelle').editable({
	    title : 'Edition du Libellé',
	    validate : function(value){
		$('#new-libelle').val(value);
		if($('#new-code').val() != ''){
		    $('#ajouter').show();
		}else{
		    $('#ajouter').hide();
		}
	    }
	});
	$('#description').editable({
	    title : 'Edition de la Description',
	    validate : function(value){
		$('#new-description').val(value);
	    }
	});
    });

    function refresh(page){
	if(!page) page = 1;
	ajax = $.ajax({
	    type : 'post',
	    url  : '<?php echo $this->url('RHX/default', array('controller'	 => 'activite', 'action'	 => 'loadIndex')) ?>/' + page
	});
	ajax.success(function(data){
	    $('#content-data').hide().html(data).fadeIn('normal');
	});
	ajax.error(function(){
	    $("#content-data").html("<div class='rh-error'>Contenu Impossible à charger</div>");
	});
	// Effacement des données précédents
	$('#edit-id').val('');
	$('#edit-libelle').val('');
	$('#edit-adresse').val('');
	openEdit = false;

	return false;
    }

    function addNew(){
	ajax = $.ajax({
	    type: 'post',
	    url : '<?php echo $this->url('RHX/default', array('controller'	 => 'activite', 'action'	 => 'addNew')) ?>',
	    data: $('#newCode').serialize()
	});
	ajax.success(function(){
	    refresh();
	    // RAZ des Inputs
	    $('#edit-id, #edit-code, #edit-libelle, #edit-couleur, #edit-description').val('');
	    ax = $.ajax({
		type: 'post',
		url : '<?php echo $this->url('RHX/default', array('controller'	 => 'activite', 'action'	 => 'reloadNew')) ?>'
	    });
	    ax.success(function(data){
		$('#newCodeForm').html(data);
	    });
	    ax.error(function(){
		location.reload();
	    });
	});
	ajax.error(function(){
	    alert('Erreur 33 : Une erreur est survenue lors de l\'ajout d\'un nouveau Code d\'Activité');
	});

	return false;
    }

    function edit(id){
	if(openEdit){
	    alert("Un Code d'Activité est en Mode édition,\nVeuillez l'enregistrer d'abord");
	    return false;
	}
	// Effacement des donneés précédents
	$('#edit-id, #edit-code, #edit-libelle, #edit-couleur, #edit-description').val('');

	// Rendre les Editables
	$('#code-' + id).editable({
	    title: "Edition du Code",
	    validate : function(value){
		$('#edit-code').val(value);
	    }
	});
	$("#libelle-" + id).editable({
	    title: "Edition du Libellé",
	    validate : function(value){
		$('#edit-libelle').val(value);
	    }
	});
	$("#couleur-" + id).removeAttr('disabled');
	$("#couleur-" + id).spectrum({
	    disabled: false,
	    flat: false,
	    showInput : true,
	    showInitial: true,
	    chooseText: "Sélectionner",
	    cancelText: "Annuler",
	    preferredFormat: "hex6",
	    showSelectionPalette: true,
	    localStorageKey: "spectrum.homepage",
	    clickoutFiresChange: true,
	    move: function(color) {
		$('#edit-couleur').val(color.toHexString());
	    }
	});
	$('#description-' + id).editable({
	    title: "Edition de la Description",
	    validate : function(value){
		$('#edit-description').val(value);
	    }
	});

	// Affectation
	$("#edit-id").val(id);
	text = ($.trim($('#code-' + id).text()) == 'Vide') ? '' : $.trim($('#code-' + id).text());
	$("#edit-code").val(text);
	text = ($.trim($('#libelle-' + id).text()) == 'Vide') ? '' : $.trim($('#libelle-' + id).text());
	$("#edit-libelle").val(text);
	$("#edit-couleur").val($('#couleur-' + id).val());
	text = ($.trim($('#description-' + id).text()) == 'Vide') ? '' : $.trim($('#description-' + id).text());
	$("#edit-description").val(text);

	// Affichage et Masquage
	$("#edit-" + id).hide();
	$("#delete-" + id).hide();
	$("#save-" + id).show();
	$("#cancel-" + id).show();

	// Verrouillage
	openEdit = true;

	return false;
    }

    function cancel(){
	refresh();
    }

    function save(){
	$id = $('#edit-id').val();

	// Test de la validité des données
	code = $('#edit-code').val();
	libelle = $('#edit-libelle').val();
	if(code == '' || libelle == ''){
	    alert("Le code ou le libellé ne peut pas être Vide");
	    return false;
	}

	// Sauvegarde dans la base de données
	ajax = $.ajax({
	    type : 'post',
	    url  : '<?php echo $this->url('RHX/default', array('controller'	 => 'activite', 'action'	 => 'save')) ?>',
	    data : $("#editCode").serialize()
	});
	ajax.success(function(){
	    refresh();
	});
	ajax.error(function(){
	    alert("Erreur 34 : Une erreur est survenue lors de la sauvegarde du Code d'Activité");
	});

	return false;
    }

    function erase(id){
	if(!id) return false;
	conf = confirm("Voulez-vous supprimer le Code Activité ?");
	if(!conf) return false;

	// Effacement de la base de données
	ajax = $.ajax({
	    type : 'post',
	    url  : '<?php echo $this->url('RHX/default', array('controller'	 => 'activite', 'action'	 => 'erase')) ?>/' + id
	});
	ajax.success(function(){
	    refresh();
	});
	ajax.error(function(){
	    alert("Erreur 35 : Une erreur est survenue lors de la suppression du Code d'Activité");
	});

	return false;
    }
</script>
